<template>
  <div class="hotShare">
    <ul>
      <li v-for="(item, index) in listShare" :key="item">
        <el-row type="flex" class="row-bg" justify="space-between">
          <el-col :span="4">
            <div class="grid-content bg-purple headers"><img :src="item.userImage" alt=""></div>
          </el-col>
          <el-col :span="18">
            <div class="grid-content bg-purple-light conther">
              <h3>{{ item.userName }}</h3>
              <p>{{ item.releaseTime }}</p>
              <h3>{{ item.content }}</h3>
              <img :src="item.image" alt="">
              <div class="boxbottom">
                <button>点赞</button>
                <button>评论</button>
              </div>
            </div>
          </el-col>
          <el-col :span="1">
            <div class="grid-content bg-purple"> <span>删除</span></div>
          </el-col>
        </el-row>
      </li>

    </ul>
    <!-- <el-pagination background layout="prev, pager, next" :total="25">
    </el-pagination> -->
  </div>



</template>
 
<script>
import axios from 'axios';



export default {
  name: 'allShareView',
  data() {
    return {
      listShare: [],
      dialogVisible: false,

    }
  },
  components: {

  },
  created() {
    this.getShare();
  },
  methods: {
    getShare() {
      axios.get('/api/CampusSharing/CampusSharingXiaoQu?Address=0')
        .then(res => {
          console.log(res);
          this.listShare = res.data;


        }).catch(err => {
          console.log(err);
        })
    },
   
  }

}
</script>
 
<style scoped>
* {
  list-style: none;
}

ul li {
  width: 95%;
  min-height: 210px;
  max-height: 1000px;
}

.headers img {
  width: 100px;
  height: 100px;
  border-radius: 50%;

}

.conther img {
  width: 210px;
  height: 140px;
}

.el-row {
  margin-bottom: 20px;

}

.el-col {
  border-radius: 4px;
}

.bg-purple-dark {
  background: #99a9bf;
}

.bg-purple {
  background: #d3dce6;
}

.bg-purple-light {
  background: #e5e9f2;
  text-align: left;
}

.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}
</style>
 


